snippet m.pg
	<!DOCTYPE html>
	<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width" />
		<title></title>
		<link rel="stylesheet" href="css/mui.min.css" type="text/css">
	</head>
	<body>
		$0
		<script src="js/mui.min.js"></script>
	</body>
	</html>
# ===============  canvas =========================

snippet m.can
	<!-- 侧滑导航根容器 -->
	<div class="mui-off-canvas-wrap mui-draggable">
		$0
	</div>
snippet m.can.aside
	<!-- 菜单容器 -->
	<aside class="mui-off-canvas-${1:left}">
		<div class="mui-scroll-wrapper">
		<div class="mui-scroll">
			<!-- 菜单具体展示内容 -->
			...
		</div>
		</div>
	</aside>
snippet m.can.con
	<!-- 主页面容器 -->
	<div class="mui-inner-wrap">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-icon mui-action-menu mui-icon-bars mui-pull-left"></a>
			<h1 class="mui-title">${1:title}</h1>
		</header>
		<div class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll">
				<!-- 主界面具体展示内容 -->
				${2:...}
			</div>
		</div>
	</div>
# ===============  list =========================

snippet m.li1
	<li class="mui-table-view-cell"> ${1:Item} </li>
snippet m.li+
	<li class="mui-table-view-cell">
		${1:Item}
	</li>
	m.li+
snippet m.lis
	<ul class="mui-table-view">
		<li class="mui-table-view-cell">
			${1:Item}
		</li>
		m.li+$0
	</ul>
# ===============  button =========================

snippet m.btn
	<button type="button" class="mui-btn">${1:clic}</button>
snippet m.badge
	<span class="mui-badge mui-badge-${1:success}">${2:22}</span>
snippet m.badge.in
	<span class="mui-badge mui-badge-${1:success} mui-badge-inverted">${2:22}</span>
snippet m.switch
	<div class="mui-switch">
		<div class="mui-switch-handle"></div>
	</div>
snippet m.switch.on
	<div class="mui-switch mui-active">
		<div class="mui-switch-handle"></div>
	</div>
snippet m.switch.mini
	<div class="mui-switch mui-switch-mini">
		<div class="mui-switch-handle"></div>
	</div>
snippet m.switch.mini.on
	<div class="mui-switch mui-switch-mini mui-active">
		<div class="mui-switch-handle"></div>
	</div>
# ===============  input =========================

snippet m.search
	<div class="mui-input-row mui-search">
		<input type="search" class="mui-input-clear" placeholder="$1">
	<div>
snippet m.range
	<div class="mui-input-row mui-input-range">
		<label>${1:Range}</label>
		<input type="range" min="${2:0}" max="${3:100}">
	</div>

# ===============  checkbox & radio  =========================

snippet m.radio
	<div class="mui-input-row mui-radio">
		<label>${1:radio}</label>
		<input name="radio1" type="radio">
	</div>
snippet m.radio.left
	<div class="mui-input-row mui-radio mui-left">
		<label>radio</label>
		<input name="radio1" type="radio">
	</div>
snippet m.radio.pg
	<ul class="mui-table-view mui-table-view-radio">
		<li class="mui-table-view-cell">
			<a class="mui-navigate-right">Item 1</a>
		</li>
		<li class="mui-table-view-cell mui-selected">
			<a class="mui-navigate-right">Item 2</a>
		</li>
		<li class="mui-table-view-cell">
			<a class="mui-navigate-right">Item 3</a>
		</li>
	</ul>
snippet m.chk
	<div class="mui-input-row mui-checkbox">
		<label>${1:checkbox}</label>
		<input name="checkbox1" value="Item 1" type="checkbox" ${2:checked}>
	</div>
# ===============  checkbox & radio  =========================
